<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
    <title>小U商城 - 商品列表</title>
    <link rel="stylesheet" href="css/list.css">
    <script src="js/index.js"></script>
    <link rel="shortcut icon" href="images/wangye_logo.png" type="image/x-icon">
</head>
<body>
    <!-- 顶部 -->
    <div id="top1">
        <span class="iconfont">&#xe60a;</span>
        <h2>小U商城</h2>
        <p>
            <i class="iconfont">&#xe648;</i>
            <span></span>
            <em class="iconfont">&#xe61c;</em>
        </p>
    </div>

    <!-- 搜索框&导航 -->
    <div id="serch_box">
        <input type="text" class="iconfont" placeholder="&#xe610; 按内容搜索">

        <!-- 导航 -->
        <nav class="nav_box">
            <ul>
                <li>
                    综合推荐
                </li>
                <li>
                    销量
                </li>
                <li>
                    价格<span class="iconfont">
                        &#xe94d;
                    </span>
                </li>
                <li>
                    好评度
                </li>
                <li>
                    店铺
                </li>
                <li>
                    <span class="iconfont">&#xe67c;</span>
                    筛选
                </li>
            </ul>
        </nav>
    </div>

    <!-- 筛选 -->
    <div id="choice">
        <div class="choice">
            筛选11.11大促商品
        </div>
    </div>
    

    <!-- 商品明细 -->
    <ul class="good_detail">
        <li>
            <img src="images/shop.jpg" alt="">
            <p class="p1">
                <span>细目原山茶花洁面泡沫 氨基酸…</span>
                <em>敏感肌可用，控油祛痘、男女可用…</em>
            </p>
            <p class="p2">
                <span>
                    <i>￥</i>999
                </span>
                <del>￥1099</del>
                <em>999人已付款</em>
            </p>
            <p class="p3">11.11限时299元起</p>
            <p class="p4">
                <em>999条评价</em>
                <em>99.9%好评</em>
            </p>
        </li>

        <li>
            <img src="images/shop.jpg" alt="">
            <p class="p1">
                <span>细目原山茶花洁面泡沫 氨基酸…</span>
                <em>敏感肌可用，控油祛痘、男女可用…</em>
            </p>
            <p class="p2">
                <span>
                    <i>￥</i>999
                </span>
                <del>￥1099</del>
                <em>999人已付款</em>
            </p>
            <p class="p3">11.11限时299元起</p>
            <p class="p4">
                <em>999条评价</em>
                <em>99.9%好评</em>
            </p>
        </li>

        <li>
            <img src="images/shop.jpg" alt="">
            <p class="p1">
                <span>细目原山茶花洁面泡沫 氨基酸…</span>
                <em>敏感肌可用，控油祛痘、男女可用…</em>
            </p>
            <p class="p2">
                <span>
                    <i>￥</i>999
                </span>
                <del>￥1099</del>
                <em>999人已付款</em>
            </p>
            <p class="p3">11.11限时299元起</p>
            <p class="p4">
                <em>999条评价</em>
                <em>99.9%好评</em>
            </p>
        </li>

        <li>
            <img src="images/shop.jpg" alt="">
            <p class="p1">
                <span>细目原山茶花洁面泡沫 氨基酸…</span>
                <em>敏感肌可用，控油祛痘、男女可用…</em>
            </p>
            <p class="p2">
                <span>
                    <i>￥</i>999
                </span>
                <del>￥1099</del>
                <em>999人已付款</em>
            </p>
            <p class="p3">11.11限时299元起</p>
            <p class="p4">
                <em>999条评价</em>
                <em>99.9%好评</em>
            </p>
        </li>

        <li>
            <img src="images/shop.jpg" alt="">
            <p class="p1">
                <span>细目原山茶花洁面泡沫 氨基酸…</span>
                <em>敏感肌可用，控油祛痘、男女可用…</em>
            </p>
            <p class="p2">
                <span>
                    <i>￥</i>999
                </span>
                <del>￥1099</del>
                <em>999人已付款</em>
            </p>
            <p class="p3">11.11限时299元起</p>
            <p class="p4">
                <em>999条评价</em>
                <em>99.9%好评</em>
            </p>
        </li>
    </ul>
    
</body>
</html>